
<html lang="en">
<head>
	<title>Service Information</title>	
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<link href="css/style.css" rel="stylesheet" type="text/css" />
	<link href="images/favicon.ico" rel="shortcut icon" >
	<g:javascript library="jquery" plugin="jquery"/>
	<script type="text/javascript" src="js/jquery-ui-1.8.5.custom.min.js"></script>
	<script type="text/javascript" src="js/jquery.collapser.min.js"></script>
	<script type="text/javascript" src="js/browser.js"></script>
	<link type="text/css" href="css/smoothness/jquery-ui-1.8.5.custom.css" rel="stylesheet" />
</head>
<body class="main">
	<div class="header">
	    <div class="block_header">
	      <div class="logo"><a href="http://www.jpdo.gov"><img src="images/logo.png" width="320" height="124" border="0" alt="logo" /></a></div>
	      <div class="clr"></div>
	      <div style="float:right;">
	        <div class="clr"></div>
	        <div class="headMenu">
		        <ul>
					<li><a href="#">Service</a></li>      
					<li><a href="#">Message</a></li>
					<li><a href="#">Information</a></li>
					<li><a href="#">Help</a></li>
				</ul>
			</div>
	      </div>
	      <div class="clr"></div>
	    </div>
  	</div>
	<div class="body">
		<div class="body_resize">
		  <div class="left">
			<div id="COIs">
				<g:each var="coi" in="${nextgen.Coi.list()}">
					<h4><a href="#">${coi.name}</a></h4>
					<div>
						<g:each var="service" in="${coi.hasServices}">
							<p class='category'>
								<g:remoteLink 
									update="serviceInfoPane" 
									controller="browserFile" 
									action="display" 
									id="${service.id}">
									${service.name}
								</g:remoteLink>	
							</p>
						</g:each>
					</div>
				</g:each>
			</div>
		  </div>
		  <div id="serviceInfoPane" class="right"></div> 
		</div>
	</div>
    <div class="bloga">
		<div class="clr"></div>
	</div>
    <div class="footer"></div>
</body>
</html>